<template>
	<view>
		<cu-custom bgColor="bg-E96141" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">健康资讯</block>
		</cu-custom>
		
		<!-- 分页数据 -->
		<view class="no-data-con"
			v-if="!pageDataList || pageDataList.length==0">
			<image src="https://ylb123.oss-cn-hangzhou.aliyuncs.com/app/empty.png"></image>
			<view class="title">暂无数据~</view>
		</view>
		<view class="page-list-con"
			v-if="pageDataList && pageDataList.length>0">
			<view class="item" v-for="(item,index) in pageDataList" :key="item.id"
				@click="toDetailPage(item)">
				<view class="cover-img-con">
					<image class="cover-img" :src="item.coverImg" mode="widthFix"></image>
				</view>
				<view class="text-con">
					<view class="title">{{item.title}}</view>
					<view>
						<text class="author">{{item.author}}</text>
						<text class="issue-time">{{item.createTime}}</text>
						<text class="click-count">{{item.clickCount>0?item.clickCount:1}}人阅读</text>
					</view>
				</view>
			</view>
		</view>
		<uni-load-more 
			v-if="pageDataList && pageDataList.length>0"
			:status="loadingType"></uni-load-more>
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	import moment from 'moment'
	
	export default {
		name: "newsList",
		components: {
			uniLoadMore	
		},
		data() {
			return {
				loadingType: 'more', //加载更多状态
				pageDataList: [],
				
				keyword: '',
				currPageNo: 1,
				totalPageNo: 1,
				pageSize: 15,
			}
		},
		created() {
			this.loadData();
		},
		methods: {
			//查看详情
			toDetailPage(item){
				if(!item.id){
					this.$tip.toast('数据错误')
					return false
				}
				let _params = '?nouse=1' +
					'&id=' + item.id
				uni.navigateTo({
					url: '/pages/news/detail' + _params
				})
			},
			onPageScroll(e){
				//兼容iOS端下拉时顶部漂移
				if(e.scrollTop>=0){
					this.headerPosition = "fixed";
				}else{
					this.headerPosition = "absolute";
				}
			},
			//下拉刷新
			onPullDownRefresh(){
				this.loadData('refresh');
			},
			//加载更多
			onReachBottom(){
				this.loadData();
			},
			//加载分页数据 ，带下拉刷新和上滑加载
			async loadData(type='add', loading) {
				let that = this
				//没有更多直接返回
				if(type === 'add'){
					if(that.loadingType === 'nomore'){
						return;
					}
					that.loadingType = 'loading';
				}else if(type === 'refresh'){
					that.pageDataList = []
					that.currPageNo = 1
				}else{
					that.loadingType = 'more'
				}
				if(that.currPageNo>that.totalPageNo){
					that.loadingType = 'nomore'
					if(loading == 1){
						uni.hideLoading()
					}else{
						uni.stopPullDownRefresh();
					}
					return false
				}
				
				let _pageParams = {
					pageNo: that.currPageNo,
					pageSize: that.pageSize,
					keyword: that.keyword
				}
				let list = await that.$http.get('/healthcms/cmsNews/list', {params:_pageParams})
					.then(res => {
						if(res.data.success){
							//uni.hideLoading()
							let jsonData = res.data.result
							if(!jsonData){
								return []
							}
							that.totalPageNo = jsonData.pages
							let _list = jsonData.records?jsonData.records:[]
							if(_list && _list.length>0){
								let _item = {}
								for(let i=0;i<_list.length;i++){
									_item = _list[i]
									_item.createTimeShort = moment(_item.createTime).format('YYYY-M-D')
									_item.day = moment(_item.createTime).format('D')
									_item.yearMonth = moment(_item.createTime).format('YYYY年M月')
								}
							}
							return _list
						}else{
							//uni.hideLoading()
						}
					}).catch(err => {
						//uni.hideLoading()
						return []
					});
				
				if(list && list.length>0){
					list.forEach(item=>{
						that.pageDataList.push(item)
					})
				}
				
				//判断是否还有下一页，有是more  没有是nomore
				that.loadingType  = (that.currPageNo >= that.totalPageNo)?'nomore':'more'
				if(type === 'refresh'){
					if(loading == 1){
						uni.hideLoading()
					}else{
						uni.stopPullDownRefresh();
					}
				}
				
				if(that.currPageNo<that.totalPageNo){
					that.currPageNo++
				}
			},
			stopPrevent(){
			},
		}
	}
</script>

<style lang="scss" scoped>
	
	/* 分页列表 */
	.space-line{
		width: 100%;
		height: 180px;
	}
	.no-data-con{
		text-align: center;
		padding: 30% 0 0 0;
		image{
			width: 150px !important;
			height: 150px !important;
		}
		.title{
			color: #aaaaaa;
		}
	}

	/* 新闻公告 */
	.page-list-con{
		padding: 20upx;
		background-color: #ffffff;
		.item{
			display:flex;
			with: 100%;
			border-bottom: 1px dashed #ececec;
			margin-bottom: 20upx;
			padding-bottom: 18upx;
			overflow: hidden;
			.cover-img-con{
				flex:1;
				image{
					width: 140upx;
					height: 70upx;
					border-radius: 10upx;
				}
			}
			&:last-child{
				border-bottom: 0;
				margin-bottom: 0;
				padding-bottom: 0;
			}
			.text-con{
				flex:4;
				margin-left: 16upx;
				font-size: 26upx;
				color: #999999;
				overflow: hidden;
				.title{
					text-overflow: ellipsis;
					white-space: nowrap;
					overflow: hidden;
					font-size: 36upx;
					color: #666666;
					margin-bottom: 20upx;
				}
				.author{
					margin-right: 24upx;
				}
				.issue-time{
					margin-right: 24upx;
				}
				.click-count{
					float: right;
				}
			}
		}
	}
	

</style>
